@charset "utf-8";
// Core variables and mixins
@import "bootstrap/variables";
@import "bootstrap/mixins";
.left{ float: left;}
.right{ float: right;}
.page-header {
	position: fixed;
	z-index: 10;
	left: 0;
	top: 0;
	padding: 0;
	margin: 0;
	width: 100%;
	.header-top {
		.navbar-nav {
			& > li.dropdown {
				float: left;
			}
		}
		.navbar-toggle {
			margin-top: 10px;
			margin-right: 0;
			.icon-bar {
				background-color: #337ab7;
			}
		}
	}
}
.content {
	padding-top: 157px;
	margin-top: 0;
}
.edit-bg{
  margin: 0 0 50px;
  padding: 10px;
  box-shadow: 0 0px 8px 0 rgba(0, 0, 0, 0.06), 0 1px 0px 0 rgba(0, 0, 0, 0.02);
  -webkit-border-radius: 5px;
  border-radius: 5px;
  -moz-border-radius: 5px;
  background-clip: padding-box;
  background-color: #ffffff;
  min-height: 700px;
}
.page-title {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 0px;
    margin-top: 0px;
    line-height: 50px;
}
@media (max-width: $screen-md-min) {
	body {
		background-color: #eff3f8;
	}
	.page-header {
		position: static;
		left: auto;
		top: auto;
		.header-top {
			height: auto;
			.page-logo {

			}
			.top-menu {
				.navbar-nav {
					margin-top: 0;
					margin-right: 0;
					margin-bottom: 10px;
				}
			}
		}
		.header-menu {
			padding-top: 20px;
			display: -none;
			height: auto;
			background-color: #eff3f8;
		}
		.search-form {
			margin-top: 0;
			margin-bottom: 10px;
			float: none;
			width: 100%;

			@at-root #{&}.open {
				width: 100%;
			}
			.input-group {
				background-color: #fff !important;
				width: 100%;
			}
			.form-control {
				background-color: #fff !important;
				box-shadow: none!important;
				-webkit-box-shadow: none!important;
			}
			.input-group-btn {
				width: 60px;
				background-color: #337ab7;
				text-align: center;
			}
			.submit {
				right: 0;
				& > span {
					color: #fff;
				}
			}
		}
		.header-menu {

			.navbar-nav {
				& > li {
					.dropdown-menu {
						a {
							padding-left: 20px;
							width: auto;
							color: #666;
						}
						& > li {
							float: none;
							&:hover {
								& > a {

									color: #337ab7;
									background-color: #fff;
								}
							}
						}
					}
					.dropdown-submenu {
						& > .dropdown-menu {
							padding-left: 20px;
						}
					}
					.mega-menu-submenu {
						li {
							&:hover {
								a {
									color: #337ab7;
									background-color: #fff;
								}
							}
						}
						h3 {
							color: #000;
						}
						a {
							color: #666;
						}
					}
				}
				li.current {
					& > a {
						background-color: #337ab7;
						color: #fff;
						.glyphicon {
							color: #fff;
						}
					}
					&:hover {
						& > a {

							background-color: #337ab7!important;
							color: #fff!important;
						}
					}
				}
				.menu-dropdown {
					& > a {
						.glyphicon {
							float: right;
							color: #fff;
						}
					}
				}
			}

		}
	}
	.content {
		margin-top: 20px;
		padding-top: 0;
	}
}

.dropdown-menu { border: none;}
.hot-menu {
	.navbar-nav {
		& > .menu-dropdown {
			&:hover > a {
				color: #f1f1f1;
				background-color: #3c85c3;
			}
			&:hover > .dropdown-menu {

				display: block;
			}
		}
	}
	.menu-dropdown {
		li {
			position: relative;
		}
		a {
			color: #fff;
			&:hover {
				color: #f1f1f1;
				background-color: #3c85c3;
			}
		}
		.arrow {
			color: #6fa7d7;
			margin-right: 5px;
			&:after {
				content: "\e259";
			}
		}
		.icon-left {
			margin-right: 5px;
		}
	}
	.current {
		& > a {
			color: #fff;
			background-color: #3c85c3 ;
		}
		& > a:focus{
			background-color: #3c85c3 !important;
		}
	}
	.open {
		& > .dropdown-menu {
			display: none;
		}
	}
	.dropdown-menu {
		padding: 0;
		margin-top: 0;
		box-shadow: 5px 5px rgba(85,97,111,.2);
		background-color: #3c85c3;
		border-radius: 0;
		.current {
			a {
				color: #ced5de;
				background-color: #3c85c3;
			}
		}
		a {
			display: block;
			padding: 10px 12px;
			font-weight: 300;
			min-width: 195px;
			span.clearfix-new{
				width: 60px; 
				height: 20px; 
				background-color: #fff; 
				text-align: center;
				color: #337ab7; 
				margin-left: 10px;
			}
			&:hover {
				background-color: #337ab7;
				span.clearfix-new{
					opacity: 0.8;
				}
			}
		}
	}
	.dropdown-menu-new {
		a {
			width: 275px;
		}
	}
	.dropdown-submenu {
		.arrow {
			float: right;
		}
		& > .dropdown-menu {
			top: 0;
			left: 195px;
			border-radius: 0;
			border: 0;
		}
		&:hover > .dropdown-menu {
			display: block;
		}
	}
}
@media (max-width: $screen-md-min) {
	.container{ margin-top: 20px !important;}
	.edit-bg{ margin: 0 0 50px;}
	#main{ margin-bottom: 100px;}
	.hot-menu {
		.navbar-nav {
			margin: 0;
			float: none;
			& > .menu-dropdown {
				float: none;
				border-bottom: 1px solid #F0F0F0;
				.dropdown-menu {
					position: static;
					display: none!important;
					margin-top: 1px;
					width: auto;
					box-shadow: none;
					float: none!important;
					background-color: #fff;
					border: none;
				}
				&:hover > a {
					background-color: #fff;
					color: #000;
				}
				& > a {
					background-color: #fff;
					color: #000;
					&:hover {
						color: #337ab7;
						background-color: #fff;
					}
				}
				.arrow {
					&:after {
						content: "\e257";
					}

				}
			}
			.open {
				& > .dropdown-menu {

					display: block!important;
					width: 100%!important;

				}
				& > a {
					background-color: #fff;
					.arrow {
						&:after {
							content: "\e259";
						}

					}
				}

			}
		}
	}
	.input-time{ margin-right: 0 !important;}
}
.header-menu {
	width: 100%;
	height: 51px;
	background-color: #337ab7;
	.container {
		position: relative;
	}
}

.header-top {
	background-color: #fff;
	.navbar-brand {
		line-height: 50px;
		font-size: 24px;
		&:hover {
			color: #337ab7;
		}
	}
}
.dropdown {
	padding: 0 4px;
	height: 50px;
	&:hover .dropdown-menu {
		display: block;
	}
}
.top-menu {
	margin-top: 13px;
	float: right;
	.dropdown-toggle {
		margin-bottom: 1px;
		padding: 17px 10px 8px;
		&:hover {
			background-color: #fff;
		}
		.circle {
			float: left;
			margin-top: -5px;
			padding: 3px 10px 4px;
			background-color: #32c5d2;
			color: #fff;
			border-radius: 50%;
		}
		.corner {
			float: left;
			margin-left: -4px;
			width: 0;
			height: 0;
			border-style: solid;
			border-width: 8px 0 9px 9px;
			border-color: transparent transparent transparent #32c5d2;
		}
		.img-circle {
			float: left;
			margin-top: -8px;
			margin-right: 8px;
			max-width: none;
			height: 40px;
		}
	}
	.dropdown-inbox {
		.photo {
			float: left;
			padding: 0 6px 6px 0;
			img {
				width: 40px;
				height: 40px;
				border-radius: 50%;
			}
		}
		.from {
			font-size: 14px;
			font-weight: 600;
			color: #5b9bd1;
		}
		.message {
			display: block;
			font-size: 12px;
			line-height: 1.3;
			margin-left: 46px;
		}
	}
	.glyphicon {
		font-size: 19px;
		color: #a4b4bb;
	}
}
.dropdown-separator {
	float: left;
	padding-left: 0;
	padding-right: 6px;
}
.separator {
	float: left;
	display: inline-block;
	width: 1px;
	height: 18px;
	margin-top: 17px;
	margin-left: 5px;
	border-left: 1px solid #E3E8EC;
}
.dropdown-dark {
	.dropdown-menu {
		right: 0;
		left: auto;
		margin-top: 5px;
		margin-right: 7px;
		min-width: 160px;
		max-width: 300px;
		width: 300px;
		background-color: #2e343b;
		&:after {
			position: absolute;
			content: "";
			top: -7px;
			right: 10px;
			display: inline-block;
			border-right: 7px solid transparent;
			border-bottom: 7px solid #2e343b;
			border-left: 7px solid transparent;
		}
	}
	.external {
		display: block;
		overflow: hidden;
		padding: 15px;
		letter-spacing: .5px;
		background-color: #272c33;
		h3 {
			float: left;
			display: inline-block;
			font-size: 13px;
			margin: 0;
			color: #a2abb7;
		}
		a {
			color: #337ab7;
			font-size: 12px;
			position: absolute;
			right: 10px;
			margin-top: -2px;
			padding: 0;
			&:hover {
				background-color: transparent;
				color: #337ab7;
			}
		}
	}
}
.dropdown-user {
	.dropdown-menu {
		width: 195px;
	}
}

.dropdown, .menu-dropdown {
	.badge {
		position: absolute;
		top: 9px;
		right: 24px;
		padding: 3px 6px;
		font-weight: 300;
		border-radius: 50%;
	}
	.badge-success {
		background-color: #36c6d3;
	}
	.badge-default {
		background-color: #f36a5a;
		color: #fff;
	}
}
.dropdown-menu-default {
	& li {
		a {
			padding: 8px 16px;
			font-size: 13px;
			color: #aaafb7;
			&:hover {
				background-color: #373e47;
				color: #aaafb7;
			}
		}
		& .glyphicon {
			display: inline-block;
			margin-right: 9px;
			width: 15px;
			color: #6FA7D7;
			font-size: 13px;
		}
	}
	.divider {
		margin: 9px 0;
		height: 1px;
		overflow: hidden;
		background-color: #3b434c;
	}
}
.slimScrollDiv {
	position: relative;
	overflow: auto;
	height: 250px;
}
.task {
	.percent {
		float: right;
		color: #36c6d3;
		display: inline-block;
		font-weight: 600;
	}
}

.progress {
	display: block;
	margin: 8px 0 2px;
	height: 8px;
	.sr-only {
		position: absolute;
		width: 1px;
		height: 1px;
		margin: -1px;
		overflow: hidden;
		clip: rect(0,0,0,0);
	}
}
.progress-bar-success {
	background-color: #36c6d3;
}
.progress-bar-hot {
	background-color: #ed6b75;
}
.progress-bar-warn {
	background-color: #F1C40F;
}
.dropdown-menu-list {
	a {
		display: block;
		padding: 16px 15px 18px;
		border-bottom: 1px solid #3b434c!important;
		text-decoration: none;
		color: #aaafb7;
		&:hover {
			background-color: #373e47;
		}
	}
	.time {
		padding: 1px 5px;
		float: right;
		max-width: 75px;
		font-size: 11px;
		text-align: right;
		font-weight: 400;
		opacity: .7;
		background-color: #23272d;
	}
	.details {
		overflow: hidden;
	}
}
.label {
	@at-root #{&}.label-icon {
		margin-right: 5px;
		padding: 4px 0 4px 4px;
		border-radius: 0;
		& > span {
			margin-left: 1px;
			margin-right: 2px;
			font-size: 12px;
			width: 1.25em;
			color: #fff;
		}
	}
	@at-root #{&}.label-sm {
		font-size: 13px;
	}
	@at-root #{&}.label-success {
		background-color: #36c6d3;
	}
}
.quick-sidebar-toggler {
	padding: 17px 10px 8px;
	cursor: pointer;
}
.page-logo {
	float: left;
	height: 75px;
}


.container-block{

	@media (min-width: $screen-lg-min) {
	  width: 20%;
	}
	.card-box {
	    padding: 10px;
	    box-shadow: 0 0px 8px 0 rgba(0, 0, 0, 0.06), 0 1px 0px 0 rgba(0, 0, 0, 0.02);
	    -webkit-border-radius: 5px;
	    border-radius: 5px;
	    -moz-border-radius: 5px;
	    background-clip: padding-box;
	    margin-bottom: 20px;
	    background-color: #ffffff;
	}
	.progress {
	    -webkit-box-shadow: none !important;
	    background-color: #ebeff2;
	    box-shadow: none !important;
	    height: 5px;
	    margin-bottom: 5px;
	    overflow: hidden;
	    background-color: rgba(16, 196, 105, 0.2);
		.progress-bar {
		    float: left;
		    width: 0;
		    height: 100%;
		    font-size: 8px;
		    line-height: 5px;
		    color: #fff;
		    text-align: center;
		    background-color: #337ab7;
		    -webkit-box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
		    box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
		    -webkit-transition: width .6s ease;
		    -o-transition: width .6s ease;
		    transition: width .6s ease;
		}
		.sr-only {
		    position: absolute;
		    width: 1px;
		    height: 1px;
		    padding: 0;
		    margin: -1px;
		    overflow: hidden;
		    clip: rect(0,0,0,0);
		    border: 0;
		}
	}

}

.widget-detail-2{
	i{
		vertical-align: top;
	    font-size: 14px;
	    padding: 0 5px;
	    color: #cacaca;
	    display: inline-block;
	    line-height: 20px;
	}
}
.i-green{ color: green !important;}
.i-red{ color: red !important;}

.mega-menu-content {
	padding: 15px;
	font-size: 13px;
	a {
		&:hover {
			text-decoration: none;
		}
	}
}
.mega-menu-full {
	.dropdown-menu {
		position: absolute;
		left: 15px;
		right: 15px;
		width: auto;
	}
}
.mega-menu-submenu {
	h3 {
		margin-top: 5px;
		color: #ced5de;
		font-weight: 400;
		font-size: 15px;
	}
}
.navbar-nav {

	.mega-menu-dropdown {
		position: static;
	}
}

.search-form {
	position: relative;
	display: inline-block;
	float: right;
	width: 176px;
	transition: width .4s;
	margin-top: 8px;
	border-radius: 4px;
	@at-root {
		#{&}.open {
			width: 300px;
		}
	}
	.input-group {
		background-color: #fff;
		display: table;
		border-collapse: separate;
		position: relative;
		.form-control {
			color: #616d7d;
			background-color: #fff;
			border: 0;
			padding-right: 20px;
			font-weight: 300;
			&:focus {
				box-shadow: none;
				-webkit-box-shadow: none;
			}
		}
	}
	.input-group-btn {
	    font-size: 0;
	    white-space: nowrap;
	    width: 1%;
	    white-space: nowrap;
	    vertical-align: middle;
	    display: table-cell;
	    position: relative;
	    z-index: 111;
	}
	.submit {
		padding: 0;
		height: 34px;
		z-index: 3;
		position: relative;
		top: 10px;
		right: 11px;
		& > span {
			color: #616d7d;
		}
	}
}

.hero {
	margin-top: 20px;
	margin-bottom: 20px;
}

.campaigns-tab{
	width: 100%;
	overflow: auto;
	position: relative;
	border: #cdcdcd 1px solid;
	.tablesorter-blue{
		margin: 0;
		border: 0;
		min-width: 1100px;
		border-bottom: 2px solid #006699;
	}
}
.select_class{
	width: 200px;
	height: 24px;
	border: 1px solid #ccc;
	margin: 20px 0;
}

.edit-campaign{
	.form-line{ 
		display: block;
		overflow: auto;
		max-height: 400px;
		.form-control{
			height: auto !important;
		}
	}
	.modal-dialog{
		width: 80% !important;
	}
	.form-group-block{
		overflow: visible !important;
		clear: none !important;
	}
}